<include file="Public/header" /> 
<script src="__PUBLIC__/js/uploadify/jquery.uploadify.min.js"></script>
<!--主窗体-->
<div class="container app">
	<!--左侧菜单-->
	<include file="Public/sidebar" /> 
	<!--左侧菜单//-->
	
	<!-- mainCon -->
	<div id="mainCon" class="mainCon">
		<h4>视频素材</h4>
		<form class="form-horizontal" id="myform">
			
			<div class="form-group">
				<label for="createtime" class="col-sm-2 control-label">标题</label>
				<div class="col-sm-5">
					<input type="text" class="form-control" name="title" value="<{$result['title']}>" placeholder="标题">
				</div>
			</div>
			
			<div class="form-group">
				<label for="cid" class="col-sm-2 control-label">所属分类</label>
				<div class="col-sm-5">
					<select class="form-control" name="cid">
						<option value="0">-请选择分类-</option>
						<foreach name="cate" item="vo">
							<option value="<{$vo['id']}>" <if condition="$result['cid'] eq $vo['id']">selected</if>><{$vo['name']}></option>
						</foreach>
					</select>
				</div>
			</div>
			
			<!--视频网址-->
			<div class="form-group">
				<label for="title" class="col-sm-2 control-label">网址</label>
				<div class="col-sm-5">
					<input type="text" class="form-control" name="web_link" id="web_link" value="<{$data['upload_link']}>" placeholder="网址" onchange="video_ajax(this)">
				</div>
			</div>		
			
			<!-- 图文预览 -->			
			<div class="form-group">
				<label for="" class="col-sm-2 control-label">产品图片</label>
				<div class="col-sm-5">
					<div class="upload-file-box" style="width:350px">
						<div class="radio col-sm-5">
							<a class="btn btn-default" id="uploadify">上传产品图片</a> <span style="margin-top:10px;float:left;color:#999">（仅允许上传1MB以内的图片）</span>
						</div>
						<div id="upload-file-view" class="OneImageBox upload-view">
							<div id="showimg">
						
								<if condition="!empty($data['thumb'])">
									<div style="width:100px;height:100px;border:1px solid #ccc;overflow:hidden;float:left;">
										<img src="<{$data['thumb']}>" style="width:100px;height:100px;float:left;margin:0 auto;padding:5px;">
										<div onclick="removeImg();" style="height:30px;width:100%;background:#000;opacity:.6;text-align:center;z-index:3;position:relative;bottom:30px;color:#fff;line-height:30px;float:left;cursor:pointer;">删除</div>
									</div>
									<input type="hidden" class="img_input" name="thumb" value="$data['thumb']">
								</if>
							</div>
	
						</div>
					</div>
				</div>
			</div>
			
			<div class="display_video"></div>
			
			<div style="clear:both;"></div>
			<div class="form-group" style="margin-top: 25px;">
				<div class="col-sm-offset-2 col-sm-10">
					<a class="btn btn-default col-sm-2 delAct" onclick="ajax_submit()">添加</a>
				</div>
			</div>
		</form>
		
	</div>
	<!-- mainCon// -->
	
</div>
<!--主窗体//-->

<script src="__PUBLIC__/js/layer/layer.js"></script>
<script src="__PUBLIC__/js/validate/jquery.validate.min.js"></script>
<script src="__PUBLIC__/js/validate/messages_zh.js"></script>
<script>
$(function(){
	
	// 文件上传
	$("#uploadify").uploadify({
		'swf'           : '/Public/js/uploadify/uploadify.swf',
		'uploader'      : "<?php echo U('Admin/Gallery/uploadImg');?>",
		'fileTypeExts'	: '*.jpg;*.png;*.gif',
		'width'			: 90,
		'buttonText' : '<a class="btn btn-default" id="uploadify">上传图片</a>',
		'hideButton' : true,
		'multi': false,
		'fileObjName' : 'imgFile',
		'fileSizeLimit' : '1MB',
		'multi'    : false, //开启,多选文件
		'uploadLimit' : 1, //允许上传文件个数
		'onUploadError' : function(back) {
			
		},
		'onUploadStart' : function(file) {

		},
		'onUploadSuccess' : function(file,data,response) {
			var r = jQuery.parseJSON(data);
			if(r.error == 0){
				var htm = '<div style="width:100px;height:100px;border:1px solid #ccc;overflow:hidden;float:left;margin-bottom:10px;">';
				htm += '<img src="/'+r.imgUrl+'" style="width:100px;height:100px;float:left;margin:0 auto;padding:5px;">';
				htm += '<div onclick="removeImg(this);" style="height:30px;width:100%;background:#000;opacity:.6;text-align:center;z-index:3;position:relative;bottom:30px;color:#fff;line-height:30px;float:left;cursor:pointer;">删除</div>';
				htm += '<input type="hidden" class="img_input" name="thumb" value="/'+r.imgUrl+'"/>';
				htm += '</div>';
				$("#showimg").append(htm);
			}
		},

	});	
		
});
	
	//移除图片
	function removeImg(obj){
		$(obj).parent().remove();
	}

		
	//视频网址--
	function video_ajax(obj){
		var web_link = $(obj).val();
		var tvideo_url = "<{:U('Admin/Material/display_iframe')}>";
	
		if(web_link == '' || web_link == undefined){
			$('.display_video').html('');
			return false;
		}
		$.ajax({
			url: tvideo_url,
			data: {
				"url": web_link
			},
			dataType: "json",
			async:false,
			success: function(data){
				var videocode = data.url;
			
				if (data.error) {
					$('input[name="web_link"]').val(videocode);
					var html = '<iframe height="480" width="400" src="'+videocode+'" frameborder="0" allowfullscreen=""></iframe>';
					$('.display_video').html(html);
					$("iframe").css({
						"width": "100%",
						"height": "300px"
					});
					return false;
				} else {
					layer.open({
						content:'该视频地址无效，请重新粘贴！'
					});
					return false;
				}
			}
		});
	}
	
	//提交
	function ajax_submit(){
		var submie_url = "<{:U('ajax_video_add')}>";
		$.ajax({
		   type: "POST",
		   url: submie_url,
		   data: $('#myform').serialize(),
		   success: function(msg){
				if(msg.status == '1'){
					layer.open({
						content:'保存成功',
						end:function (){
							window.location.href="<{:U('Admin/Material/video_list',array('k'=>10,'sk'=>5))}>";
						}
					});
				}else{
					layer.open({
						content:'添加失败了。请重新添加'
					});
					return false;
					
				}
		   }
		});
	}
	
</script>

<include file="Public/footer" /> 